msg_id = 0;
current = null;
current_type = null;

function create_lower() {
    if ("lower" == current && "lower" == current_type) {
        return;
    }
    clear_klasses();
    clear_buttons();

    current = "lower";
    current_type = 'lower';
    $("<h4 id='klass_title' style='clear: both; margin-bottom: -21px'>Lower Division Requirements</h4>").insertBefore("#klasses");
    var cogsci = $("<li class='klass'>CogSci 1: Introduction to Cognitive Science</li>");
    $("#klasses").append(cogsci);
    var math = $("<li class='klass'>Math 1A: Calculus <b>or</b> Math 16A: Analytical Geometry and Calculus</li>");
    $("#klasses").append(math);
    var comp = $("<li class='klass'>CS 61A: Structure and Interpretation of Computer Programs <b>or</b> Engineering 7: Introduction to Programming for Scientists and Engineers</li>");
    $("#klasses").append(comp);
    var brain = $("<li class='klass'>MCB 61: Brain, Mind, and Behavior <b>or</b> MCB 64: Exploring the Brain: Introduction to neuroscience</li>");
    $("#klasses").append(brain);
    var stats = $("<li class='klass'>Math 55: Discrete Mathematics <b>or</b> CS 70: Discrete Mathematics and Probability Theory</li>");
    $("#klasses").append(brain);


}

function clear_klasses() {
    $(".klass").remove();
}

function clear_buttons() {
    $("#concentration_link").remove();
    $("#distribution_link").remove();
    $("#klass_title").remove();

}

function style_klasses() {
    $(".klass").css("font-size", "14px");
    $(".klass").css("margin-bottom", "0.75em");
    $(".klass").css("margin-left", "-2.5em");
}

function add_button(start, type) {
    if (type == 'distribution') {
        var conc_link = $('<a id="concentration_link" href="#!"><div>Concentration</div></a>');
        $("#button_section").append(conc_link);
        $("<h4 id='klass_title' style='clear: both; margin-bottom: -21px'>Distribution Requirements</h4>").insertBefore("#klasses");
        $("#concentration_link").click(function() {
            transition_klasses(start, "concentration");
        });
    } else {
        var dis_link = $('<a id="distribution_link" href="#!"><div >Distribution</div></a>');
        $("#button_section").append(dis_link);
        $("<h4 id='klass_title' style='clear: both; margin-bottom: -21px'>Concentration Requirements</h4>").insertBefore("#klasses");
        $("#distribution_link").click(function() {
            transition_klasses(start, "distribution");
        });
    }
}

function transition_klasses(start, type) {
    if (start == current && type == current_type) {
        return;
    }
    msg_id++;
    $.ajax({
        url: '/courses/get_courses/',
        data: { pillar: start,
                req_type: type,
                msg_id: msg_id},
        success: function(data, textStatus, jqXHR) {
            //console.log(data);
            if (data.msg_id != msg_id) {
                return;
            }

            clear_klasses();
            clear_buttons();
            var ul_el = $("#klasses");
            var actual_data = data.data;
            for (var i in actual_data) {
                var klass = actual_data[i];
                if (klass[3] == 1) {
                    var new_el = $("<b><li class='klass' id='" + klass[0] +
                        "'>" + klass[1] + ": " + klass[2] + "</li></b>");

                } else {
                    var new_el = $("<li class='klass' id='" + klass[0] +
                        "'>" + klass[1] + ": " + klass[2] + "</li>");
                }
                ul_el.append(new_el);
            }
            current = start;
            current_type = type;
            style_klasses();
            add_button(start, type);
        },
        dataType: 'json'
    });
}

$(function () {
    $(".pillar").attr("current", false);
    $("area#society").click(function () { transition_klasses("society",
                                                             "distribution"); });
    $("area#ling").click(function () { transition_klasses("ling",
                                                          "distribution"); });
    $("area#phil").click(function () { transition_klasses("phil",
            "distribution"); });
    $("area#neuro").click(function () { transition_klasses("neuro",
            "distribution"); });
    $("area#comp").click(function () { transition_klasses("comp",
            "distribution"); });
    $("area#psych").click(function () { transition_klasses("psych",
            "distribution"); });
    $("area#lower").click(function () { create_lower(); });
    create_lower();
});
